<template>
	<view style="background-color:  #e66f13;padding: 0 15px; height: 100%; display: flex; flex-direction: column;">
		<view class="shang">
			<view class="shzuo">倒计时：</view>
			<view class="shyou">
				<view class="progress">
					<view class="pro"></view>
				</view>
			</view>
		</view>
		<view class="img-total">
			<view class="img-one">
				<image src="../../static/ihgPic/front0.png" style="width: 130rpx;height: 164rpx;"></image>
				<image src="../../static/ihgPic/front1.png" style="width: 130rpx;height: 164rpx;"></image>
				<image src="../../static/ihgPic/front2.png" style="width: 130rpx;height: 164rpx;"></image>
				<image src="../../static/ihgPic/front3.png" style="width: 130rpx;height: 164rpx; margin-right: 0;"></image>
			</view>
			<view class="img-tow">
				<image src="../../static/ihgPic/front4.png" style="width: 130rpx;height: 164rpx;"></image>
				<image src="../../static/ihgPic/front5.png" style="width: 130rpx;height: 164rpx;"></image>
				<image src="../../static/ihgPic/front1.png" style="width: 130rpx;height: 164rpx;"></image>
				<image src="../../static/ihgPic/front7.png" style="width: 130rpx;height: 164rpx; margin-right: 0;"></image>
			</view>
			<view class="img-three">
				<image src="../../static/ihgPic/front7.png" style="width: 130rpx;height: 164rpx;"></image>
				<image src="../../static/ihgPic/front6.png" style="width: 130rpx;height: 164rpx;"></image>
				<image src="../../static/ihgPic/front1.png" style="width: 130rpx;height: 164rpx;"></image>
				<image src="../../static/ihgPic/front4.png" style="width: 130rpx;height: 164rpx; margin-right: 0;"></image>
			</view>
			<view class="img-four">
				<image src="../../static/ihgPic/front6.png" style="width: 130rpx;height: 164rpx;"></image>
				<image src="../../static/ihgPic/front3.png" style="width: 130rpx;height: 164rpx;"></image>
				<image src="../../static/ihgPic/front2.png" style="width: 130rpx;height: 164rpx;"></image>
				<image src="../../static/ihgPic/front5.png" style="width: 130rpx;height: 164rpx; margin-right: 0;"></image>
			</view>
		</view>
		
	</view>

	
</template>

<script>
	export default {
		data() {
			return {
				
			}
		},
		methods: {
			
		}
	}
</script>

<style>
	.shang{
		height: 77px;
		line-height: 77px;
		display: flex;
		align-items: center;
	}
	.shzuo{
		color: #fff;
		font-size: 18px;
	}
	.shyou{
		flex-grow: 1;
	}
	.progress{
		flex-grow: 1;
		border: 3px solid #fff;
		height: 9px;
		padding: 1px;
		border-radius: 10px;
	}
	.pro{
		height: 9px;
		width: 50%;
		background-color: #fff;
		border-radius: 10px;
	}
	uni-page-body {
	    display: block;
	    box-sizing: border-box;
	    width: 100%;
	    height: 100%;
	}
	.img-total {
		/* display: flex; */
		/* flex-direction: column; */
		/* justify-content: space-between; */
		width: 100%;
		flex-grow: 1;
	}
	.img-one,.img-tow,.img-three,.img-four {
		display: flex;
		justify-content: space-around;
		width: 95%;
		margin: auto;
		height: 25%;
		/* background-color: #fff; */
	}


</style>
